<template>
	<view>
		<!-- 顶部导航栏 -->
		<swiper-tab :tabBars="tabBars" :tabIndex="tabIndex" @tabtap="tabtap"></swiper-tab>
		
		<!-- 轮播图 -->
		<view class="uni-tab-bar">
			<swiper class="swiper-box" 
			:style="{height:swiperheight+'px'}" 
			:current="tabIndex" 
			@change="tabChange">
				<swiper-item v-for="(items,index) in newslist" :key="index">
					<scroll-view scroll-y class="list" @scrolltolower="loadmore(index)">
						<template v-if="items.list.length>0">
							<!-- 图文列表 -->
							<block v-for="(item,index1) in items.list" :key="index1">
								<index-list :item="item" :index="index1"></index-list>
							</block>
							
							<!-- 上拉加载 -->
							<load-more :loadtext="items.loadtext"></load-more>
						</template>
						<template v-else>
							<!-- 无内容默认 -->
							<no-thing></no-thing>
						</template>
						
					</scroll-view>
				</swiper-item>
				
			</swiper>
		</view>
		<!-- 视图 -->
	<!-- 	<block v-for="(item,index) in list" :key="index">
			<index-list :item="item" :index="index"></index-list>
			
		</block>
	 -->
	
	
	</view>
</template>

<script>
	import indexList from "../../components/index/index-list.vue";
	import swiperTab from "../../components/index/swiper-tab.vue";
	import loadMore from "../../components/commom/load-more.vue";
	import noThing from "../../components/commom/no-thing.vue";
	export default {
		data() {
			return {
				swiperheight:500,
				tabIndex:0,
				tabBars:[
					{
						"name":'关注',
						"id":'guanzhu'
					},
					{
						"name":'推荐',
						"id":'tuijian'
					},
					{
						"name":'体育',
						"id":'tiyu'
					},
					{
						"name":'热点',
						"id":'redian'
					},
					{
						"name":'财经',
						"id":'caijing'
					},
					{
						"name":'娱乐',
						"id":'yule'
					}
				],
				newslist:[
					{   loadtext:'上拉加载更多',
						list:[
							{
								userpic:'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2563649107,170005376&fm=11&gp=0.jpg',
								username:'慢性吻别',
								isguanzhu:false,
								title:'头脑僵化的人是十足的蠢驴',
								type:'img',//img,video
								titlepic:'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1599007979,1484951390&fm=26&gp=0.jpg',
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3874067489,2447793058&fm=11&gp=0.jpg',
								username:'小鸟依人~',
								isguanzhu:false,
								title:'人成长的代价，或许就是渐渐地扔掉一些原则，自己却没有觉察。',
								type:'video',//img,video
								titlepic:'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3792007838,2791088287&fm=26&gp=0.jpg',
								playnum:"20w",
								long:"2:47",
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							}
						]
					},
					{   loadtext:'上拉加载更多',
						list:[
							{
								userpic:'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1254866339,2820233178&fm=26&gp=0.jpg',
								username:'思想、已抛锚',
								isguanzhu:false,
								title:'“神明是存在的，但神并不爱你。”',
								type:'img',//img,video
								titlepic:'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3009624321,630779002&fm=26&gp=0.jpg',
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=828664256,4198115969&fm=11&gp=0.jpg',
								username:'-笨咖咖',
								isguanzhu:false,
								title:'每朵云都下落不明，每盏月亮都不知所踪。',
								type:'video',//img,video
								titlepic:'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1524274077,3570062555&fm=11&gp=0.jpg',
								playnum:"20w",
								long:"2:47",
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1372008467,1096844886&fm=11&gp=0.jpg',
								username:'莫·朝三暮四',
								isguanzhu:false,
								title:'有人住高楼，有人在深沟，有人光万丈，有人一身锈，世人万千种，浮云莫去求，斯人若彩虹，遇上方知有。',
								type:'img',//img,video
								titlepic:'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1729339222,3828963364&fm=11&gp=0.jpg',
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=378197393,4138783667&fm=11&gp=0.jpg',
								username:'糜拥',
								isguanzhu:false,
								title:'没有不可治愈的伤痛，没有不能结束的沉沦，所有失去的，会以另一种方式归来。',
								type:'video',//img,video
								titlepic:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=494577325,3768689839&fm=11&gp=0.jpg',
								playnum:"20w",
								long:"2:47",
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							}
						]
					},
					{   loadtext:'上拉加载更多',
						list:[
							{
								userpic:'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=928126284,662575165&fm=11&gp=0.jpg',
								username:'此夏、若空。',
								isguanzhu:false,
								title:'围在城里的人想逃出来，站在城外的人想冲进去，婚姻也罢、事业也罢，人生的欲望大都如此。',
								type:'img',//img,video
								titlepic:'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3344662133,2549091206&fm=11&gp=0.jpg',
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2183333647,616187925&fm=11&gp=0.jpg',
								username:'秋海棠的思念。',
								isguanzhu:false,
								title:'你不愿意种花，你说，我不愿看见它一点点凋落。是的，为了避免结束，你避免了一切开始。',
								type:'video',//img,video
								titlepic:'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1431141736,3755761553&fm=11&gp=0.jpg',
								playnum:"20w",
								long:"2:47",
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1706634016,1270928097&fm=11&gp=0.jpg',
								username:'六月ゝ 毕业季﹏',
								isguanzhu:false,
								title:'生活总是让我们遍体鳞伤，可是后来，那些受伤的地方一定会变成我们最强壮的地方。',
								type:'img',//img,video
								titlepic:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=4293192010,1449564734&fm=11&gp=0.jpg',
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2400171829,846368540&fm=11&gp=0.jpg',
								username:'聊不来就oｕt',
								isguanzhu:false,
								title:'你没有如期归来，而这正是离别的意义。',
								type:'video',//img,video
								titlepic:'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1460125675,1769069103&fm=11&gp=0.jpg',
								playnum:"20w",
								long:"2:47",
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1957817314,1831186644&fm=11&gp=0.jpg',
								username:'忆昔流年 牵拌ta1r▓',
								isguanzhu:false,
								title:'车站有两个地方最感人：一个入口，一个出口。一个是不想让你走，一个是等你回来。',
								type:'img',//img,video
								titlepic:'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1640993882,1234783337&fm=11&gp=0.jpg',
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							},
							{
								userpic:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2706655814,2584498900&fm=11&gp=0.jpg',
								username:'南音i',
								isguanzhu:false,
								title:'明月清风晓星尘，傲雪凌霜宋子琛。 敛芳瑶琴金光散，泽芜洞箫蓝曦痕。 君子如兰茶未满，旧识思追酒已温。 红尘焉有忘机语，梦醒愿为无羡人。',
								type:'video',//img,video
								titlepic:'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2831579960,3824247595&fm=11&gp=0.jpg',
								playnum:"20w",
								long:"2:47",
								infonum:{
									index:0,//0还没有操作,1定了,2踩了
									dingnum:11,
									cainum:11,
								},
								
								commentnum:10,
								sharenum:10
								
								
							}
						]
					},
					{   loadtext:'上拉加载更多',
						list:[]
					},
					{   loadtext:'上拉加载更多',
						list:[]
					},
					{   loadtext:'上拉加载更多',
						list:[]
					}
				]
				
			}
		},
		onLoad() {
			uni.getSystemInfo({
				success:(res)=>{
					let height=res.windowHeight-uni.upx2px(100)
					this.swiperheight=height;
				}
			})

		},
			//监听原生标题导航按钮点击事件
			onNavigationBarButtonTap(e) {
				switch (e.index){
					case 1:
					//打开发布页面
					uni.navigateTo({
						url:'../add-input/add-input',
					})
						break;
				}
			},
		//监听搜索框点击事件
		onNavigationBarSearchInputClicked(){
			uni.navigateTo({
				url:'../search/search',
			})
		},
		methods: {
			//上拉加载事件
			loadmore(index){
				if(this.newslist[index].loadtext!="上拉加载更多"){
					return;
				}
				//修改状态
				this.newslist[index].loadtext="加载中...";
				// 获取数据
				setTimeout(()=>{
					//获取完成
					let obj={
						
							userpic:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1986451467,394304688&fm=26&gp=0.jpg',
							username:'▄ 灵魂深处一朵妩媚花',
							isguanzhu:false,
							title:'所有的苦难与背负尽头，都是行云流水般的此世光阴。',
							type:'img',//img,video
							titlepic:'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=407849403,1177133812&fm=11&gp=0.jpg',
							infonum:{
								index:0,//0还没有操作,1定了,2踩了
								dingnum:11,
								cainum:11,
							},
							
							commentnum:10,
							sharenum:10
							
							
						
					};
					this.newslist[index].list.push(obj)
					this.newslist[index].loadtext="上拉加载更多"
				},1000);
				// this.newslist[index].loadtext="没有更多数据了";
				
			},
			//tabBar点击事件
			tabtap(index){
				this.tabIndex=index;
			},
			//滑动事件
			tabChange(e){
				this.tabIndex=e.detail.current;
				
			}

		},
		components:{
			indexList,
			swiperTab,
			loadMore,
			noThing
		}
	}
</script>

<style>

</style>
